<template>
  <div id="app">
    <!-- 调用模块化的属性 -->

    <!-- 方式1: 原始方式 -->
    <div>token = {{ this.$store.state.user.token }}</div>
    <div>name = {{ this.$store.state.setting.name }}</div>

    <!-- 方式2: 通过getters快捷访问 -->
    <div>方式2-token = {{ token }}</div>
    <div>方式2-name = {{ name }}</div>
  </div>
</template>

<script>
// 方式2 通过getters来快捷访问
import {  mapGetters } from 'vuex'

export default {
  computed: {
    // 方式2 通过getters来快捷访问
    ...mapGetters(['token', 'name'])
  }
}
</script>

<style>
</style>
